import MyIcon from '@/components/MyIcon';
import ScrollBarLayoutNotScroll from '@/components/ScrollBarLayoutNotScroll';
import { getPersonalInfo, getTenantID, getUserID } from '@/utils';
import { Col, Row } from 'antd';
import { useEffect, useState } from 'react';
import { history } from 'umi';
import Cls from 'classnames';

export const CommonFunctionTable = ({ curRes }) => {
  const styleFixCls = 'common-function-table';
  const [menuList, setMenuList] = useState<Record<string, any>[]>([]);
  const filterContrac = [
    '/myAssetController/manage',
    '/useAsReturnController/manage',
    '/assetAllotController/manage',
    '/assetTransferController/manage',
    '/toAssetController/manage',
    '/assetDiscardController/manage',
    '/assetRepairController/manage',
    // '/assetProtectController/manage',
  ];

  useEffect(() => {
    if (curRes && JSON.stringify(curRes) != '{}' && getUserID()) {
      const { paramObject } = getPersonalInfo();
      if (paramObject) {
        if (paramObject?.menuResourceList?.length) {
          const contractManage = paramObject?.menuResourceList?.find((item) => item?.serviceType == `${getTenantID()}00001014`)?.children;
          const array: any = [];
          const filMenu = (data) => {
            for (let index = 0; index < data.length; index++) {
              const element: any = data[index];
              if (filterContrac?.indexOf(element?.url) != -1 && curRes?.[element?.url]) {
                array.push(element);
                if (element?.children?.length > 0) {
                  filMenu(element?.children);
                }
              } else if (element?.children?.length > 0) {
                filMenu(element?.children);
              }
            }
          };
          if (contractManage?.length) {
            filMenu(contractManage);
          }
          setMenuList(array);
        }
      }
    }
  }, [curRes, getUserID()]);

  return (
    <div className={styleFixCls} style={{ borderRadius: '10px' }}>
      <ScrollBarLayoutNotScroll>
        <Row gutter={[8, 12]} className={`${styleFixCls}-menuDivBox`}>
          {menuList?.map((item: any, index: number) => {
            return (
              <Col
                span={8}
                key={`homePageContract-menuItem-${index}`}
                onClick={() => {
                  history?.push({
                    pathname: item?.url,
                    state: {},
                  });
                }}
              >
                <div className={`${styleFixCls}-menuDivBox-iconDiv`}>
                  <MyIcon type={item?.icon} isTheme={true} style={{ fontSize: 34 }} />
                </div>
                <div style={{ fontSize: 16, marginTop: 5, whiteSpace: 'nowrap', fontWeight: 600 }}>{item?.name || '--'}</div>
              </Col>
            );
          })}
        </Row>
      </ScrollBarLayoutNotScroll>
    </div>
  );
};
